
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="JS/jquery-1.8.3.js"></script>
    <script src="CSS/bootstrap.min.js"></script>
    <link rel="stylesheet" href="CSS/bootstrap.css">
    <style>
        h2 {
            text-align: center;
        }

        table {
            text-align: center;
        }

        #title {
            font-size: large;
            text-align: center;
        }
    </style>
</head>
<body>

<h2>试题中心</h2>

<table class="table table-hover">
    <tr>
        <td >试卷主题:</td>
        <td  colspan="5"><input id="tName" type="text" class="form-control" placeholder="请输入试卷主题"></td>
    </tr>
    <tr>
        <td>题目</td>
        <td>选项(1)</td>
        <td>选项(2)</td>
        <td>选项(3)</td>
        <td>选项(4)</td>
        <td>正确答案编号</td>
    </tr>
</table>
<button type="button" id="add" class="btn btn-default">新增</button>
<button type="button" id="sub" class="btn btn-primary">提交</button>

</body>

<script>
    var nameNo = 0;
    $(function () {
        $("#add").click(function () {
            nameNo++;
            var tr = "<tr name='" + nameNo + "'><td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入题目\"></td>\n" +
                "        <td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入第一个选项\"></td>\n" +
                "        <td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入第二个选项\"></td>\n" +
                "        <td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入第三个选项\"></td>\n" +
                "        <td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入第四个选项\"></td>\n" +
                "        <td><input type=\"text\" class=\"form-control\"  placeholder=\"请输入正确答案选项编号\"></td>\n" +
                "    </tr>";
            $(".table").append(tr);
        });

    })
    
    $("#sub").click(function () { //添加试卷名
        var tName = $("#tName").val();
        if (tName == ""){
            alert("试卷名不能为空!!")
        } else {
            insertName(tName); //插入试题名
        }

    });


    function insertItem(tName) {
        var getTr = $(".table-hover").find("tr");
        var item = new Array();
        $.each(getTr, function (index, data) {
            var input = $(data).find("input");
            $.each(input, function (index1, da) {
                item[index1] = $(da).val(); //将试题和答案传入数组中
            })
            $.ajax({
                type:"post",
                url:"InsertItemServlet",
                data:{item:JSON.stringify(item),tName:tName},
                success:function (data) {
                    alert(data)
                }
            })
        })
    }


    function insertName(name) { //插入试卷名称
        $.ajax({
            type:"post",
            url:"InsertTestNameServlet",
            data:{tName:name},
            success:function (data) {
              if (data == "true" || data == "wrong"){ //返回true代表插入成功,返回wrong代表已经有该板块题目,继续插入试
                  insertItem(name);
              }
              if (data == "error") { //返回error说明未获取到试卷名称
                  alert("试卷名称获取失败!!");
                  return;
              }
            }
        });
    }



</script>

</html>
